.transform-skew {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: center;
  height: 200px;

  .container {
    width: 100px;
    height: 100px;
    margin: 20px;
    background-color: #c9c9c9;
  }

  .item {
    width: 100px;
    height: 100px;
    opacity: 0.5;
    background-color: #bae7ff;
    transform-origin: 0 0;
  }

  .zero {
    transform: skew(0);
  }

  .fifty-deg {
    transform: skew(15deg, 15deg);
  }

  .two-values {
    transform: skew(-0.06turn, 18deg);
  }

  .rad {
    transform: skew(.312rad);;
  }
}
